<template>
  <div>
    <van-nav-bar title="创建" left-text="返回" left-arrow @click-left="onClickLeft" />
    <van-form @submit="onSubmit">
      <van-field v-model="value" label="标题" placeholder="请输入标题" />
      <div class="sc">
        <span>上传</span>
        <van-uploader v-model="fileList" multiple />
      </div>
      <van-field
        v-model="message"
        rows="2"
        autosize
        label="留言"
        type="textarea"
        maxlength="100"
        placeholder="请输入留言"
        show-word-limit
      />
      <div style="margin: 16px;">
        <van-button round block type="info" native-type="submit">提交</van-button>
      </div>
    </van-form>
  </div>
</template>
<script>
export default {
  data() {
    return {
      value: "",
      fileList: [
        // Uploader 根据文件后缀来判断是否为图片文件
        // 如果图片 URL 中不包含类型信息，可以添加 isImage 标记来声明
      ],
      message: "",
    };
  },

  methods: {
    afterRead(file) {
      // 此时可以自行将文件上传至服务器
      console.log(file);
    },
    onSubmit(values) {
      console.log("submit", values);
    },
    onClickLeft() {
      this.$router.push("/mycenter");
    },
  },
};
</script>
<style>
.van-form > div {
  margin: 3vh auto;
  border: 1px solid red;
}
.sc {
  display: flex;
}
.sc > span {
  color: #646566;
  margin-left: 3vw;
  margin-top: 3vh;
}
.sc > div {
  margin-left: 20vw;
}
</style>
